{extend name="public/base"}

{block name="title"}
设置
{/block}

{block name="style"}
{css href="/static/wechat/css/set.css" /}
<style type="text/css">
    .setTradePsd .weui-cell__bd span{border:1px solid #FF9900;}
    .setTradePsd .weui-cell__bd input{text-indent:-9999px;left:-9px;}
</style>
{/block}

{block name="body"}
<div class="pageControl">
    <div class="msui_nav msui_navTop">
        <a class="msui_navTop-back" href="javascript:history.back();"><i class="micon-back"></i></a>
        <h1 class="msui_navTop-title">设置交易密码</h1>
    </div>
    <div class="weui-top">
        <form>
            <input type="hidden" name="phone" value="{$phone}">
            <div class="block_1">
                <div class="weui-cells weui-cells_form">
                    <div class="weui-cell">
                        <div class="weui-cell__hd"><label class="weui-label">验证码</label></div>
                        <div class="weui-cell__bd">
                            <input class="weui-input" type="number" name="code"  placeholder="请输入验证码">
                        </div>
                        <div class="weui-cell_ft">
                            <button class="weui_cell-verify js-verify cl-orange">获取验证码</button>
                        </div>
                    </div>
                </div>
                <div class="msui_button">
                    <div class="msui_button-bd">
                        <a class="msui_button-content block_1_btn">下一步</a>
                    </div>
                </div>
            </div>
            <div class="block_2 setTradePsd" style="display: none">
                <div class="weui-cells weui-cells_form js-content">
                    <div class="weui-cell">
                        <div class="weui-cell__bd set_focus">
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                            <span></span>
                            <input class="weui-input" type="number" name="safe_password" id="safe_password" value="" placeholder="" unselectable="on" />
                        </div>
                    </div>
                </div>
                <div class="msui_button">
                    <div class="msui_button-bd">
                        <a href="javascript:;" class="send_save_safe_password_form msui_button-content">确认提交</a>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>

<!-- loading toast -->
<div id="loadingToast" style="display:none;">
    <div class="weui-mask_transparent"></div>
    <div class="weui-toast" style="opacity: 1; visibility: visible;">
        <i class="weui-loading weui-icon_toast"></i>
        <p class="weui-toast__content">加载中...</p>
    </div>
</div>

{/block}

{block name="javascript"}
<script>
    $(function () {
        $(".block_1_btn").click(function () {
            if(!$("input[name='code']").val()) {
                alert('验证码不能为空！！');
                return false;
            }
            // 验证验证码
            var code = $('input[name="code"]').val();
            var phone = $('input[name="phone"]').val();
            $.get("{:url('base/check_code')}", {code : code, phone : phone}, function (msg) {
                console.log(msg);
                if(msg.code == 200) {
                    $(".block_1").hide();
                    $(".block_2").show();
                } else {
                    var e_code = msg.code;
                    $.alert(error_code[e_code]);
                }
            })
        });

        $(document).on('focus', '#safe_password', function () {
            $(this).css('margin-left', '-99999px');
        });
        $(document).on('blur', '#safe_password', function () {
            $(this).css('margin-left', '0');
        });

        $(".send_save_safe_password_form").click(function () {
            $('#loadingToast').fadeIn();

            var code = $('input[name="code"]').val();
            var safe_password = $('input[name="safe_password"]').val();
            $.ajax({
                type : 'POST',
                url : '?',
                data : {
                    code : code,
                    safe_password : safe_password
                },
                dataType : 'json',
                success : function (msg) {
                    $('#loadingToast').fadeOut();
                    if (msg.code == 200) {
                        alert('修改成功！！');
                        window.location.href = '{:url("member/index")}';
                    } else {
                        var code = msg.code;
                        $.alert(error_code[code]);
                    }
                }
            });
        });
    });
</script>
{/block}